import { FC } from 'react';
import { Modal, message, Form, DatePicker } from 'antd';
import { useLoading } from '@/hooks/baseHook';
import { addFilesByTime } from '@/api/sr-stms';
import moment from 'moment';

const { RangePicker } = DatePicker;

interface Iprops {
  visible: boolean;
  onCancel(): void;
  callback?(): void;
  record: any;
}

const SyncModal: FC<Iprops> = (props) => {
  const { visible, onCancel, callback, record } = props;
  const [loading, load] = useLoading();
  const [form] = Form.useForm();

  const importSubmit = async () => {
    const vals = await form.validateFields();
    await load(
      addFilesByTime({
        dataset_id: record.id,
        start_time: moment(vals.time[0]).format('YYYY-MM-DD HH:mm:ss'),
        end_time: moment(vals.time[1]).format('YYYY-MM-DD HH:mm:ss'),
      }),
    );
    message.success('提交成功！');
    handleCancel();
  };

  const handleCancel = () => {
    onCancel();
  };

  return (
    <Modal
      title="同步"
      visible={visible}
      onCancel={handleCancel}
      onOk={importSubmit}
      okButtonProps={{
        loading,
      }}
    >
      <Form form={form}>
        <Form.Item
          name="time"
          label="时间"
          rules={[{ required: true, message: '必选！' }]}
        >
          <RangePicker showTime></RangePicker>
        </Form.Item>
      </Form>
    </Modal>
  );
};

export default SyncModal;
